<template>
    <div class="container">
        <p>当前父组件的计数：{{ count }}</p>
        <childmodule v-if="isExist" @updateCount="updateCount"></childmodule>
        <button @click="isExist = !isExist">切换</button>
    </div>
    </template>
    
    <script setup>
    import {ref} from 'vue'
    import childmodule from './childmodule.vue';
    
    const isExist = ref(false) //使用isExist变量来决定childmodule组件的挂载与卸载
    
    const count = ref(0)
    const updateCount = (newCount) => {
        count.value = newCount; //更新count
    }
    </script>
    
    <style scoped>
    .container{
        margin-top:50px;
        background-color: rgb(217, 217, 217);
        border-radius: 15px;
        padding:10px;
        margin:20px;
    }
    </style>